﻿@model MobilesStore.WebUI.Models.CartIndexViewModel

@{
    ViewBag.Title = "Mobile Store: your cart";
    Layout = "~/Views/Shared/_MainLayout.cshtml";
}
<div id="column-left">
        <!--Category Start -->
        <div class="box">
          <div class="box-heading">Categories</div>
          <div class="box-content box-category">
            <ul id="cat_accordion">
              <li class="custom_id20">@Html.ActionLink("Home","Index","Home")<span class="down"></span>
                @{Html.RenderAction("Menu", "Nav");}
              </li>
            </ul>
          </div>
        </div>
        <!--Category End -->
        <!--Refine Search Start-->
        <div class="box">
          <div class="box-heading">Refine Search</div>
          <div class="box-content">
            <ul class="box-filter">
              <li><span id="filter-group">Price</span>
                <ul>
                  <li>
                    <input type="checkbox" value="3" id="filter3" />
                    <label for="filter3">$0 - $100 (1)</label>
                  </li>
                  <li>
                    <input type="checkbox" value="4" id="filter4" />
                    <label for="filter4">$100 - $500 (5)</label>
                  </li>
                  <li>
                    <input type="checkbox" value="5" id="filter5" />
                    <label for="filter5">$500 - $1000 (1)</label>
                  </li>
                  <li>
                    <input type="checkbox" value="6" id="filter6" />
                    <label for="filter6">$1000 - $1500 (0)</label>
                  </li>
                </ul>
              </li>
            </ul>
            <a id="button-filter" class="button">Refine Search</a> </div>
        </div>
        <!--Refine Search End-->
        <!--Latest Product Start-->
        <div class="box">
          <div class="box-heading">Latest</div>
          <div class="box-content">
            <div class="box-product">
              <div class="flexslider">
                @{Html.RenderAction("LatestProductsSmall", "Nav");}
              </div>
            </div>
          </div>
        </div>
        <!--Latest Product End-->
        <!--Banner Start-->
        <div class="banner">
          <div><a href="#"><img src="../../Images/image/product/small-banner1-220x350.jpg" alt="banner" title="banner" /></a></div>
        </div>
        <!--Banner End-->
      </div>
      <!--Middle Part Start-->
      <div id="content">
        <!--Breadcrumb Part Start-->
        <div class="breadcrumb"> @Html.ActionLink("Home","Index","Home") &raquo; @Html.ActionLink("Mobiles","List","Product") </div>
        <!--Breadcrumb Part End-->
        <h1 style="color:deeppink">Your Cart</h1>
        <!--Product Grid Start-->
        <section id="cart">
          <div class="heading">
            <h4><img width="32" height="32" alt="" src="~/Images/image/cart-bg.png"></h4>
            <a><span id="cart-total"><b style="color:deeppink">@Model.Cart.lines.Count()</b> item(s) -<b style="color:deeppink">@Model.Cart.ComputeTotalValue().ToString("c")</b></span></a> </div>
          <div class="content">
            <div class="mini-cart-info">
              <table>
                  @foreach(var p in Model.Cart.lines)
                  {
                    <tr>
                        @{
                            if(p.Product.ImageData!=null)
                            {
                                <td class="image"><img width="64" height="80" src="@Url.Action("GetImage", "Product", 
                                    new { p.Product.ProductID })" alt="@p.Product.ProductName" title="@p.Product.ProductName" /></td>
                            }else{
                                <td class="image"><img width="64" height="80" src="../../Images/image/product/apple_cinema_30-162x162.jpg" alt="@p.Product.ProductName" title="@p.Product.ProductName" /></td>
                            }
                        }
                      <td class="name">@Html.ActionLink(p.Product.ProductName,"Detail","Product",new{p.Product.ProductID},null)</td>
                      <td class="quantity">x&nbsp;@p.Quantity</td>
                      <td class="total">@Model.Cart.ComputeCartlineValue(p)</td>
                      <td class="remove">@using (Html.BeginForm("RemoveFromCart","Cart"))
                                        {
                                            @Html.Hidden("productID",p.Product.ProductID)
                                            @Html.HiddenFor(x=>x.ReturnUrl)
                                            <input class="button" type="submit" value="Remove"/>
                      }
                      </td>
                    </tr>
                  }
              </table>
            </div>
            <div class="mini-cart-total">
              <table>
                <tr>
                  <td class="right"><b>Sub-Total:</b></td>
                  <td class="right" style="color:deeppink"><b>@Model.Cart.ComputeSubValue(0.8f).ToString("c")</b></td>
                </tr>
                <tr>
                  <td class="right"><b>Eco Tax (2%):</b></td>
                  <td class="right" style="color:deeppink"><b>@Model.Cart.ComputeSubValue(0.02f).ToString("c")</b></td>
                </tr>
                <tr>
                  <td class="right"><b>VAT (18%):</b></td>
                  <td class="right" style="color:deeppink"><b>@Model.Cart.ComputeSubValue(0.18f).ToString("c")</b></td>
                </tr>
                <tr>
                  <td class="right"><b>Total:</b></td>
                  <td class="right" style="color:deeppink"><b>@Model.Cart.ComputeTotalValue().ToString("c")</b></td>
                </tr>
              </table>
            </div>
            <div class="checkout"><a class="button" href="@Model.ReturnUrl">Continue Shopping</a> &nbsp; <span class="button">@Html.ActionLink("Checkout", "Checkout", "Cart", new { returnUrl = Request.Url.PathAndQuery }, new { @class="button"})</span></div>
          </div>
        </section>
        <!--Product Grid End-->
        <!--Pagination Part Start-->
        <!--Pagination Part End-->
      </div>
      <!--Middle Part End-->
